<script setup lang="ts">
import { RouterLink, RouterView, useRoute, useRouter } from "vue-router";
import Management from "./views/management/index.vue";

</script>

<template>
    <div class="app">
        <router-view></router-view>
        <!-- <Management></Management> -->
    </div>
</template>

<style lang="scss">
.el-picker__popper {
    --el-datepicker-border-color: transparent !important;

    .el-popper {
        line-height: 3.5vh !important;
        border: 0.1vw solid var(--el-datepicker-border-color);
        border-radius: 0.5vw !important;

        .el-popper__arrow:before {
            border: 0.1vw solid var(--el-datepicker-border-color);
        }
    }

    .el-picker-panel {
        line-height: 3.5vh !important;
    }

    .el-date-picker {
        width: 17vw !important;
        height: 17vw !important;

        .el-picker-panel__content {
            width: 15vw !important;
            margin: 1vw !important;
        }
    }

    .el-date-picker__header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 5vh;
        padding: 1vw 1vw 0 !important;

        .el-date-picker-panel__content {
            margin: 1vw !important;
        }

        .el-date-picker__next-btn,
        .el-date-picker__prev-btn {
            display: flex;

            .el-picker-panel__icon-btn {
                font-size: 1vw !important;
                margin-top: 0 !important;
            }
        }

        .el-date-picker__header-label {
            font-size: 1vw !important;
            line-height: 6vh !important;
            padding: 0 !important;
        }
    }

    .el-date-table {
        font-size: 0.5vw !important;

        td {
            padding: 0 !important;
            height: 0 !important;

            .el-date-table-cell {
                height: 3.8vh !important;
                padding: 1.8vh 0 !important;

                .el-date-table-cell__text {
                    line-height: 0 !important;
                    width: 1vw !important;
                    height: 0 !important;
                }
            }
        }

        th {
            padding: 0.6vh !important;
            border-bottom: 0.1vw solid var(--el-border-color-lighter) !important;
        }
    }
}

.app {
    display: flex;
    flex-direction: column;
}


* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

a {
    text-decoration: none;
}

input {
    outline: none;
}

button {
    cursor: pointer;
}
</style>
